<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>用户列表</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" href="../../css/bootstrap.min.css"/>
    <link rel="stylesheet" th:href="@{/css/mystyle.css}" href="../../static/css/mystyle.css" />
</head>
<body>
<div class="container background">
    <div style="height: 50px"></div>
    <div th:replace="fragments :: navbar"></div>
    <div class="container">
        <ul class="nav nav-pills">
            <li role="presentation" class="pull-right"><a href="/monitor/login" class="btn">添加用户</a></li>
            <li role="presentation" class="pull-right"><a href="/monitor/list" class="btn">返回列表</a></li>
        </ul>
        <table class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>编号</th>
                <th>用户名称</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:if="${users.empty}">
                <td colspan="3">没有用户</td>
            </tr>
            <tr th:each="user : ${users}">
                <td th:text="${users.indexOf(user)+1}"></td>
                <td th:text="${user.userName}">主题一</td>
                <!--th:if="${order.orderStatus == '未接单'}"-->
                <td ><a th:href="@{/monitor/user/remove(userName=${user.userName})}">移除该用户</a></td>
            </tr>
            </tbody>
        </table>
        <div id="showDetail"></div>
    </div>
</div>
<script type="text/javascript" th:src="@{/js/jquery-1.7.2.js}"
        src="../../static/js/jquery-1.7.2.js"></script>
<script type="text/javascript" th:src="@{/plugin/layer/layer.js}"
        src="../../static/plugin/layer/layer.js"></script>
<script type="text/javascript">
    $(function () {
        $("a[opera=jiedan]").click(function () {
            var orderNum = $(this).attr("orderNum");
            var detailUrl = $(this).attr("detailUrl");
            $.ajax({
                url:"/monitor/detail",
                type:"get",
                data:{param:detailUrl},
                success:function (result) {
                    $("#showDetail").html(result);
                },
                error:function (result) {

                }
            })
        });
    })

    setInterval(function(){
        location.reload();
    }, 600000);
</script>
</body>
</html>